<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>权限管理首页</title>
		<link rel="stylesheet" href="./js/layui/css/layui.css" />
		<link rel="stylesheet" href="css/index.css" />
		
	</head>
	<body class="layui-layout-body">
		<div class="layui-layout layui-layout-admin">
			<!--头部-->
			<div class="layui-header">
				<!--头部左侧导航-->
				<ul class="layui-nav layui-layout-left" lay-filter="leftmenu">
					<li class="layui-nav-item">
						<a href="./index.html" title="主页"><i class="layui-icon layui-icon-home"></i></a>
					</li>
					<li class="layui-nav-item">
						<a href="javascript:window.location.reload();" title="刷新"><i class="layui-icon layui-icon-refresh-3"></i></a>
					</li>
				</ul>
				<center><font color="#EB7350"><h1>欢迎进入权限管理系统</h1></font></center>
				<!--头部右侧导航-->
				<ul class="layui-nav layui-layout-right" lay-filter="rightmenu">
					<li class="layui-nav-item">
						<a href="javascript:;">
							<i class="layui-icon layui-icon-user"></i>
							心的远行
						</a>
						<dl class="layui-nav-child">
							<dd><a href="javascript:;" lay-href="./userinfo.html"><i class="layui-icon layui-icon-form"></i>基本资料</a></dd>
							<dd><a href="javascript:;" lay-href="./changepassword.html"><i class="layui-icon layui-icon-password"></i>修改密码</a></dd>
						</dl>
					</li>
					<li class="layui-nav-item">
						<a href="javascript:;">锁屏<i class="layui-icon layui-icon-password"></i></a>
					</li>
					<li class="layui-nav-item"><a href="./login.html">退出</a></li>
				</ul>
			</div>
			<!--左侧-->
			<!--带滚动条垂直导航-->
			<div class="layui-side layui-side-menu">
				<div class="layui-side-scroll layui-bg-orange">
					<div class="layui-logo">
                        <img src="./img/logo.png" alt="logo" style="width: 220px;height: 50px">
                    </div>
					<div class="layui-side layui-bg-orange">
						    <div class="layui-side-scroll">
						      <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
							  <ul id="menutree"></ul>
						    </div>
						  </div>
					</div>
				</div> 
			
			<!--正文-->
			<div class="layui-body">
			  <!-- 内容主体区域 -->
					<div class="layui-tab layui-bg-gray" lay-filter="tabs" lay-allowClose="true ">
						<ul class="layui-tab-title layui-bg-white">
						</ul>
						<div class="layui-tab-content" >
						</div>
					</div>
			</div>
			<!--底部-->
			<div class="layui-footer">
			  <!-- 底部固定区域 -->
			  © layui.com - 底部固定区域
			</div>
		</div>
		<script  src="js/layui/layui.js"></script>
		<script  src="js/jquery-3.1.1.min.js"></script>
		<script>
			$(function(){
				var roleName = window.localStorage.getItem('roleNames');
				//var roleNames = roleName.split(",");
				//alert(roleName);
				var globalurl = window.localStorage.getItem("globalUrl");
				var token = window.localStorage.getItem("token");
				$.ajax({
					url:'/api/GetSysRightsJsonLayUI',
					data:{
						roleNames:roleName,
						token:token
					},
					dataType:"json",
					type:"post",
					success:function(res){
						layui.use(['tree','element'],function(){
							var tree = layui.tree;
							var element = layui.element;
							tree.render({
								elem:"#menutree",
								data:res,
								accordion:true,
								showLine:false,
								click: function(obj){
									var node = obj.data;
									console.log(node.href)
									var exist = $("li[lay-id='" + node.id + "']").length;//判断是不是用重复的选项卡
									if (exist > 0) {
										element.tabChange('tabs', node.id);// 切换到已有的选项卡
									} else {
										if (node.href != null && node.href != "") {// 判断是否需要新增选项卡
											element.tabAdd(
												'tabs',
												{
													title: node.title,
													content: '<iframe class="layui-admin-iframe" frameborder="0" id="demoAdmin" style="width: 100%; height: 699px;" src=" '
													+ node.href
													+ ' " ></iframe>'// 支持传入html
													,
													id: node.id
												});
											element.tabChange('tabs', node.id);
										}
									}
									
								}
							})
						})
					}
				})
			})
		
		</script>
		
		<script>
			layui.use(['element','layer'],function(){
				var element = layui.element
				,layer = layui.layer
				,$ = layui.jquery;
				//隐藏tab主页关闭标签
				$(".layui-tab-title li:first-child i:last-child").css("display","none");
				//顶部右侧菜单监控
				element.on('nav(rightmenu)',function(elem){
					var url = $(this).attr("lay-href");
					if(url!=undefined){
						layer.open({
							title:elem[0].innerText,
							type: 2,
							content:url,
							area: ['600px', '500px']
						});
					}
					if(elem[0].innerText=="锁屏"){
						layer.open({
							title:"已锁屏"
							,content: '<input name="pass" class="layui-input" type="text" placeholder="请输入密码,默认123123" autocomplete="off"/>'
							,btnAlign: 'c'
							,anim: 1
							,btn: ['解锁']
							,yes: function(index, layero){
								var pass = layero.find('.layui-layer-content input').val();
								if(pass=="123123"){
						    		layer.close(index);
								}else{
									layer.title("密码不正确！", index);
								}
							}
							,cancel: function(){ 
						    	return false //开启该代码可禁止点击该按钮关闭
							}
						});
					}
				})
			});
		</script>
	</body>
</html>
